import React, { Component } from 'react';
import { connect } from 'react-redux'
import { List } from 'antd-mobile'
import { getList } from '../../api'
class Index extends Component {
	async getList() {
		const resp = await getList()
		this.props.dispatch({ type: 'SET_LIST', payload: resp.data.data })
	}
	componentDidMount() {
		this.getList()
	}
	render() {
		const { list, dispatch } = this.props
		return (
			<List>
				{
					list.length > 0 && list.map((v, i) => {
						return <List.Item
							key={i}
							prefix={<img src={v.url}></img>}
							description={v.desc}
						>
							{v.title}
						</List.Item>
					})
				}
			</List>
		);
	}
}
// 第一个函数 返回组件所需要的仓库数据
const mapState = state => {
	return state
}
// 第二个函数 返回组件所需要的仓库数据
const mapDispatch = dispatch => {
	return {
		dispatch
	}
}
export default connect(mapState, mapDispatch)(Index);
